<!--
	创建者：luyiming
	该文件用于：
	创建时间：2019-12-27 23:13:24
-->
<template>
	<div class="VueEleForm_cmp">
		<div class="form_item_title" v-if="title">
			{{title}}
		</div>
		<el-form
			ref="form"
			:model="form"
			:label-width="formStyle.labelWidth"
			class="form_wrap"
			:rules="rules"
			:disabled="isDisabled"
			:validate-on-rule-change="false"
		>
			<div class="form_row" v-for="(v, i) of formateData" :key="i">
				<div class="form_col" v-for="(vi, ind) of v" :key="`${i}_${ind}`" :style="getColStyle(vi)">
					<el-form-item
						:label="vi.label || ''"
						:prop="vi.moduleKey"
						:label-width="vi.labelWidth"
						:inline-message="vi.inlineMessage"
					>
						<component
						v-if="vi.type!=='radio-group' && vi.type"
						:is="`el-${vi.type}`"
						:placeholder="vi.placeholder"
						:type="vi.typeProp || 'text'"
						:autosize="{ minRows: 3, maxRows: 5}"
						v-model="form[vi.moduleKey]"
						:clearable="!vi.unclearable"
						:active-text="vi.activeText"
						:props="vi.props || {}"
  						:inactive-text="vi.inactiveText"
						:options="vi.options"
						:disabled="vi.disabled"
						:maxlength="vi.maxlength"
						:minlength="vi.minlength"
						:show-password="vi.showPassword"
						:show-word-limit="vi.showWordLimit"
						:active-value="vi.activeValue"
						:filterable="vi.filterable"
						:inactive-value="vi.inactiveValue"
						@change="changeForm(vi.moduleKey)"
						:style="{width: getItemInputWidth(vi) }"
						>
							<component
								:is="`el-${vi.children}`"
								v-for="(item, index) of vi.options"
								:key="`${i}_${ind}_${index}`"
								:value="item[vi.idKey]"
								v-if="vi.children"
								:label="item[vi.labelKey]"
							>
								<span>{{vi.type !== 'checkbox-group' ? item[vi.labelKey] : item[vi.idKey]}}</span>
								<!-- <span>{{item.id}}</span> -->
							</component>
						</component>
						<el-radio-group
							v-if="vi.type==='radio-group'"
							v-model="form[vi.moduleKey]"
							@change="changeForm(vi.moduleKey)"
						>
							<component
								:is="`el-${vi.children}`"
								v-for="(item, index) of vi.options"
								:key="`${i}_${ind}_${index}`"
								:value="item[vi.idKey]"
								:label="item[vi.idKey]"
								v-if="vi.children"
							>
								<span>{{item[vi.labelKey]}}</span>
							</component>
						</el-radio-group>
						<div class="aft_item fr" v-if="vi.after && !vi.disabled" :style="{width:vi.after.width}">
							<after-content :content="vi"></after-content>
						</div>
					</el-form-item>
				</div>
			</div>
			<el-form-item v-if="!outofSubmit">
				<el-button type="primary" @click="onSubmit('form')">立即创建</el-button>
    			<el-button @click="resetForm('form')">取消</el-button>
			</el-form-item>
		</el-form>
	</div>
</template>

<script>
import VueEleForm from './index.js';
export default VueEleForm;
</script>

<style lang="scss">
@import "./index.scss";

</style>
